﻿/*  
Theme Name: MonsterGrid Demo Style - Foo
Theme URI: http://code.google.com/p/monstergrid
Description: A demonstration style built to display the simplicity of MonsterGrid.
Version: 1.0
Author: Michael Springer
Author URI: http://michael-springer.net
License: GNU General Public License v3 - http://www.gnu.org/licenses/gpl.html
*/

/* This is just a basic demo style to show how simple it is to build a design
 * using the MonsterGrid framework. The styles system just uses the principal
 * css is built off of: elements defined further down on the list have higher priority.
 * Using this you can easily modify the webpage without having to touch the core.
 * 
 * Also included are empty definitions for basic elements that I did not define for this
 * theme but may be desired to become modified for a custom design.
 * 
 * While this style is rather simple itself, it must be noted that the design is only as 
 * simple as you make it; do not be bound to what I have written below: think outside the box.
*/

body {background: #fff;}
#wrapper {background: url('img/wrapper_bg.png') repeat-y center;}

/* Header & Title */
#header {background: url('img/header_bg.png') repeat-x center; width: 100%; height: 200px;}

#main-title {margin: 0 auto; text-align: center; }
#main-title a {color: #fff;}

#description {margin: 0 auto; text-align: center; color: #fff;}

/* Navigation & Menu */
#nav {background: #999933; color: #fff; width: 100%; border-top: 1px solid black; border-bottom: 1px solid black;}

#menu {}
#menu ul li {}
#menu ul li a {}

/* Content Area */
#page {background: url('img/page_bg.png') repeat-x; width: 100%;}

#col-c {}

#col-r {}

/* Footer */

/* Uses Sticky-Footer method found on http://www.cssstickyfooter.com/using-sticky-footer-code.html */
#page {padding-bottom: 100px;} /* padding = footer height */
#footer {margin-top: -100px;} /* margin = negative value of footer height;
/* End Sticky Footer fix */

#footer {background: #252525; width: 100%; height: 100px; color: #fff; text-align: center;}
#footer a, #footer a:hover, #footer a:visited {color: #fff;}
#footer-top, #footer-mid {display: none;}
